<template>
  <div class="mod-config">
    <div v-if="objpart">
      <el-form :inline="true" :model="dataForm" @keyup.enter.native="search()">
        <el-form-item>
          <el-select v-model="dataForm.sex" placeholder="请选择性别">
            <el-option v-for="item in options" :key="item.val" :label="item.label" :value="item.val"></el-option>
          </el-select>
        </el-form-item>
        <el-form-item>
          <el-input v-model="dataForm.name" placeholder="姓名"></el-input>
        </el-form-item>
        <el-form-item>
          <el-input v-model="dataForm.school" placeholder="学校"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button @click="search()">查询</el-button>
          <el-button type="primary" @click="addOrUpdateHandle()">新增</el-button>
          <!-- <el-button
            type="danger"
            @click="deleteHandle()"
            :disabled="dataListSelections.length <= 0"
          >批量删除</el-button> -->
        </el-form-item>
      </el-form>
      <el-table
        :data="dataList"
        border
        v-loading="dataListLoading"
        @selection-change="selectionChangeHandle"
        style="width: 100%;"
      >
        <el-table-column type="selection" header-align="center" align="center" width="50"></el-table-column>
        <el-table-column prop="id" header-align="center" align="center" label="伴读对象编号"></el-table-column>
        <!-- <el-table-column prop="sortIndex" header-align="center" align="center" label="排序编号"></el-table-column> -->
        <el-table-column prop="name" header-align="center" align="center" label="姓名"></el-table-column>
        <el-table-column prop="headUrl" header-align="center" align="center" label="头像">
          <template slot-scope="scope">
            <img :src="scope.row.headUrl" style="width:40px;height:40px;">
          </template>
        </el-table-column>
        <el-table-column prop="sex" header-align="center" align="center" label="性别">
          <template slot-scope="scope">
            {{scope.row.sex==1?'男生':''}}
            {{ scope.row.sex === 2? '女生': '' }}
            {{ scope.row.sex === 0 ? '未知': '' }}
          </template>
        </el-table-column>
        <el-table-column prop="age" header-align="center" align="center" label="年龄">

        </el-table-column>
        <el-table-column prop="school" header-align="center" align="center" label="学校"></el-table-column>
        <el-table-column prop="classPosition" header-align="center" align="center" label="身份"></el-table-column>
        <el-table-column prop="birthplace" header-align="center" align="center" label="地址"></el-table-column>

        <el-table-column prop="gmtCreated" header-align="center" align="center" label="创建时间"></el-table-column>
        <el-table-column prop="gmtUpdate" header-align="center" align="center" label="更新时间"></el-table-column>
        <!--<el-table-column header-align="center" align="center" label="心愿单">-->
          <!--<template slot-scope="scope">-->
            <!--<el-button type="text" size="small" @click="editwish(scope.row.id)">编辑</el-button>-->
          <!--</template>-->
        <!--</el-table-column>-->
        <el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-pagination
        @size-change="sizeChangeHandle"
        @current-change="currentChangeHandle"
        :current-page="pageIndex"
        :page-sizes="[10, 20, 50, 100]"
        :page-size="pageSize"
        :total="totalPage"
        layout="total, sizes, prev, pager, next, jumper"
      ></el-pagination>
      <!-- 弹窗, 新增 / 修改 -->
      <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
    </div>
    <div v-else>
      <editor-wish v-if="editorWish" :id="partnerId" @goback="partner"></editor-wish>
    </div>
  </div>
</template>
<style>
  .active {
    color: #f00;
  }
</style>
<script>
  import AddOrUpdate from "./partnertargetinfo-add-or-update";
  import EditorWish from "./wish/partnerwish";

  export default {
    data() {
      return {
        // 性别
        options: [
          {
            val: "0",
            label: "未知"
          },
          {
            val: "1",
            label: "男"
          },
          {
            val: "2",
            label: "女"
          }
        ],
        dataForm: {
          key: "",
          isRecommended: '',
          name: '',
          school: '',
          sex: '',

        },
        dataList: [],
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataListLoading: false,
        dataListSelections: [],
        addOrUpdateVisible: false,
        seepart: false,//查看
        wish: false,
        objpart: true,
        editorWish: false,
        partnerId: ''//心愿ID
      };
    },
    components: {
      AddOrUpdate,
      EditorWish
    },
    activated() {
      this.getDataList();
    },
    methods: {
      search() {
        this.pageIndex = 1
        this.getDataList()
      },
      // 获取数据列表
      getDataList() {
        this.dataListLoading = true;
        let obj = {
          page: this.pageIndex,
          limit: this.pageSize,
          key: this.dataForm.key
        };
        if (this.dataForm.sex) {
          obj.sex = this.dataForm.sex;
        }
        if (this.dataForm.isRecommended) {
          obj.isRecommended = this.dataForm.isRecommended;
        }
        if (this.dataForm.name) {
          obj.name = this.dataForm.name;
        }
        if (this.dataForm.school) {
          obj.school = this.dataForm.school;
        }
        this.$http({
          url: this.$http.adornUrl("/partner/partnertargetinfo/list"),
          method: "get",
          params: this.$http.adornParams(obj)
        }).then(({data}) => {
          if (data && data.code === 0) {
            this.dataList = data.page.list;
            this.totalPage = data.page.totalCount;
            var sortObj = this.dataList.sort(sorting("sortIndex"));
          } else {
            this.dataList = [];
            this.totalPage = 0;
          }
          this.dataListLoading = false;
        });
      },
      // 每页数
      sizeChangeHandle(val) {
        this.pageSize = val;
        this.pageIndex = 1;
        this.getDataList();
      },
      // 当前页
      currentChangeHandle(val) {
        this.pageIndex = val;
        this.getDataList();
      },
      // 多选
      selectionChangeHandle(val) {
        this.dataListSelections = val;
      },
      // 查看 OK
      // 新增 / 修改 OK
      addOrUpdateHandle(id) {
        this.addOrUpdateVisible = true;
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(id);
        });
      },

      // 禁用 OK
      //  disable(id) {
      //   this.dataForm.id = id;
      //   if (this.dataForm.id) {
      //     this.$http({
      //       url: this.$http.adornUrl(
      //         `/partner/partnertargetinfo/disable/${this.dataForm.id}`
      //       ),
      //       method: "get",
      //       params: this.$http.adornParams()
      //     }).then(({ data }) => {
      //       this.getDataList();
      //       console.log("aaa");
      //     });
      //   }
      // },
      // 删除 OK

      // 心愿单
      editwish(id) {
        this.partnerId = id;
        this.objpart = false;
        this.editorWish = true;
        // console.log(this.editorWish = true)
        //   this.$nextTick(() => {
        //     this.$refs.wisheditor.init(id);
        //   });
      },
      partner() {
        this.objpart = true;
        this.editorWish = false;
      }
    }
  };

  function sorting(max) {
    return function (obj1, obj2) {
      var value1 = obj1[max]
      var value2 = obj2[max]
      return value2 - value1
    }
  }
</script>
